<template>
  <li @touchstart="show" :class="{ active: falg }" @touchend="falg = false">
    {{ item.name }}
  </li>
</template>

<script>
export default {
  props: ["item"],
  data() {
    return {
      falg: false,
    };
  },
  methods: {
    show() {
      this.falg = true;
      // console.log(123);
    },
  },
};
</script>

<style lang="less" scoped>
li {
  transition: all 0.5s;
  &.active {
    background: rgb(255, 153, 0);
    border-radius: 15px;
  }
}
</style>